<template>
  <div id="exam-management" class="container">
    <table-filter>
      <el-input
          v-model="apiSetting.data.examName"
          clearable
          placeholder="请输入考试名称"
      ></el-input>
      <el-select
          v-model="apiSetting.data.examcha"
          clearable
          placeholder="请选择试卷性质"
      >
        <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
        >
        </el-option>
      </el-select>
      <el-button plain type="warning" @click="search">查询</el-button>
    </table-filter>
    <el-row>
      <el-button plain type="primary" @click="showEaDialog = true"
      >添加考试
      </el-button
      >
    </el-row>
    <data-table ref="dtb" :api-setting="apiSetting" pagination>
      <el-table-column
          fixed
          prop="examid"
          label="考试编号"
          show-overflow-tooltip
      />
      <el-table-column prop="examname" label="考试名称" show-overflow-tooltip/>
      <el-table-column prop="examcha" label="考试性质" show-overflow-tooltip>
        <template slot-scope="{ row }">
          {{ row.examcha ? "正式" : "模拟" }}
        </template>
      </el-table-column>
      <el-table-column
          prop="examtype"
          label="考试类型"
          show-overflow-tooltip
          :formatter="examFormat"
      >
      </el-table-column>
      <el-table-column prop="starttime" label="开始时间" show-overflow-tooltip>
        <template slot-scope="{ row }">
          {{ row.starttime | formatterDate }}
        </template>
      </el-table-column>
      <el-table-column prop="endtime" label="结束时间" show-overflow-tooltip>
        <template slot-scope="{ row }">
          {{ row.endtime | formatterDate }}
        </template>
      </el-table-column>
      <el-table-column fixed="right" label="操作" width="160">
        <template slot-scope="{ row }">
          <el-button class="warning" @click="hasEaPermission(row.createperson,'edit',row)" type="text" size="small"
          >编辑
          </el-button>
          <el-button @click="hasEaPermission(row.createperson,'reExam',row)" type="text" size="small"
          >重考设置
          </el-button>
          <el-button
              @click="hasEaPermission(row.createperson,'delRow',`/sys/examManage/deleteExam/${row.examid}`, '考试')"
              type="text"
              class="danger"
              size="small"
          >删除
          </el-button>
        </template>
      </el-table-column>
    </data-table>
    <ea-examination
        ref="eaDialog"
        :show.sync="showEaDialog"
        @on-reload="dtb.loadData()"
    />
    <re-exam ref="reExam" :show.sync="showReExamDialog"></re-exam>
  </div>
</template>

<script>
import dtb from "../../../mixins/refs/dtb";
import eaDialog from "../../../mixins/refs/eaDialog";
import EaExamination from "./EaExamination";
import deleteRow from "../../../mixins/dataTable/deleteRow";
import tbSearch from "@/mixins/dataTable/tbSearch";
import ReExam from "@/views/management/examination/ReExam";
import permission from "@/mixins/permission/permission"

export default {
  name: "index",
  components: {ReExam, EaExamination},
  mixins: [tbSearch, dtb, eaDialog, deleteRow, permission],
  data() {
    return {
      apiSetting: {
        method: "post",
        url: "/sys/examManage/getExamManageList",
        data: {
          examname: null,
          examcha: null
        }
      },
      showReExamDialog: false,
      options: [
        {
          value: 0,
          label: "模拟"
        },
        {
          value: 1,
          label: "正式"
        }
      ]
    };
  },
  methods: {
    examFormat(row) {
      switch (row.examtype) {
        case 0:
          return "笔试";
        case 1:
          return "现场";
        case 2:
          return "上机考试";
      }
    },
    async edit(row) {
      const singleData = await this.api.getExaminationById(row.examid);
      singleData.studentlist = singleData.studentlist.split(",");
      this.showEaDialog = true;
      this.eaDialog.setEditData({
        singleData: {
          ...singleData,
          selectTime: [singleData.starttime, singleData.endtime]
        }
      });
    },
    reExam({examid, examname, endtime}) {
      if (new Date() < Date.parse(endtime, 'yyyy-MM-dd h:m:s')) {
        this.$message({
          type: 'warning',
          message: '未结束的考试不能设置重考!'
        })
        return false;
      }
      this.axios.get(`/sys/examManage/getUpdateInfo/${examid}`).then(res => {
        this.showReExamDialog = true;
        if (res) {
          //重考修改
          res.selectedTime = [
            new Date(res.reexamstatrtime),
            new Date(res.reexamendtime)
          ];
          res.studentlist = res.studentlist.split(",");
          this.$refs.reExam.setEditData({
            singleData: res,
            examid,
            examname
          });
        } else {
          //新增
          this.$refs.reExam.$data.examid = examid;
          this.$refs.reExam.$data.examname = examname;
        }
      });
    }
  }
};
</script>

<style scoped></style>
